import { createRouter, createWebHistory } from 'vue-router'
import MusicPlayer from '../components/MusicPlayer.vue'
import Detail from '../components/Detail.vue'
import Playlist from '../components/Playlist.vue'

const routes = [
    {
        path: '/music-player',
        name: 'MusicPlayer',
        component: MusicPlayer
    },
    {
        path: '/',
        redirect: '/music-player'
    },
    {
        path: '/detail',
        name: 'Detail',
        component: Detail
    },
    {
        path: '/playlist',
        name: 'Playlist',
        component: Playlist,
        props: (route) => ({
            playlist: JSON.parse(route.query.playlist || '[]'),
            currentIndex: Number(route.query.currentIndex) || 0
        })
    }
]

const router = createRouter({
    history: createWebHistory(),
    routes
})

export default router